<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed'); ?>

<div class="box">
	<div class="box-header">
		<h3 class="box-title"><i class="fa fa-newspaper-o"></i> <?=$this->lang->line("ARTICLES")?></h3>
	</div>
	<div class="box-body ">

		<? 
		$this->load->helper('text');
		//Common::pr($articleList); exit; 
		?>

		<table id="articleSortTable" class="display table table-bordered">
			<thead>
				<tr>
					<th class="text-right w1">#</th>
					<th><?=$this->lang->line("TITLE")?></th>
					<th class="w1 ws">&nbsp;</th>
				</tr>
			</thead>
			<tbody>
				<?php
				$cnt = count($articleList);
				foreach($articleList as $ii => $art) {
					echo		"<tr>";
					echo			"<td class=\"vm w1 text-right\"></td>";
					echo			"<td class=\"vm\">".$art["artName"]." - ".$art["artOrder"]."</td>";
					echo			"<td class=\"vm w1 ws text-center\">";
					if($ii) {
						echo				"<button type=\"button\" class=\"btn btn-xs btn-primary\" data-order=\"".$articleList[$ii-1]["artOrder"]."\" data-order-art=\"".$art["artId"]."\"><span class=\"glyphicon glyphicon-arrow-up\"></span></button>";
					}
					if($ii != $cnt-1) {
						if($ii)
							echo				"&nbsp;";
						echo				"<button type=\"button\" class=\"btn btn-xs btn-primary\" data-order=\"".$articleList[$ii+1]["artOrder"]."\" data-order-art=\"".$art["artId"]."\"><span class=\"glyphicon glyphicon-arrow-down\"></span></button>";
					}
					echo			"</td>";
					echo		"</tr>";
				}
				?>
			</tbody>
		</table>

		<script>
			$(document).ready( function () {

				var articleSortTable = $('#articleSortTable').DataTable({
					"language": {
						"url": "<?=MEDIA?>admin_lte/DataTables-1.10.3/localization/en.lang"
					},
					ordering: false,
					paging: false,
					searching: false,
					"autoWidth": false,
					"columnDefs": [{
						"searchable": false,
						"orderable": false,
						"targets": 0
					}, {
						"searchable": false,
						"orderable": false,
						"targets": -1
					}],
					"order": [[ 1, 'asc' ]],
					stateSave: true
				});

				articleSortTable.on('draw.dt', function () {
					articleSortTable.column(0, {search:'applied', order:'applied'}).nodes().each( function (cell, i) {
						$(cell).addClass('text-right');
						cell.innerHTML = i+1 + '.';
					});
					$('#articleSortTable').removeClass('hidden');

					$('button[data-order]').unbind('click').on('click', function() {
						$this = $(this);
						$.ajax({
							type: "POST",
							cache: false,
							data: { sort: true, artPosition: '<?=$artPosition?>', ID: $this.data('orderArt'), position: $this.data('order') },
							url: '<?=site_url("admin_lte/article_insert_update")?>',
							beforeSend: function() {
								$('#studyDisplayModal .modal-body').html('<?=$this->db->escape_str($this->lang->line("PLEASE_WAIT,_PROCESSING_IN_PROGRESS"))?>');
							},
							success: function (result) {
								$.ajax({
									type: "POST",
									cache: false,
									data: { artPosition: '<?=$artPosition?>' },
									url: '<?=site_url("admin_lte/articles_sort")?>',
									beforeSend: function() {
										$('#studyDisplayModal .modal-body').html('<?=$this->db->escape_str($this->lang->line("PLEASE_WAIT,_PROCESSING_IN_PROGRESS"))?>');
									},
									success: function (result) {
										$('#studyDisplayModal .modal-body').html(result);
									},
									error: function (error) {}
								});
							},
							error: function (error) {}
						});
					});

				});

			});

		</script>

	</div>
</div>